<template>
    <div class="address_item" :class="'address_item'+type" @click="itemClick">
        <div class="address_item_left">
            <div class="address_item_lefticon">
            </div>
        </div>
        <div class="address_item_content">
          <div class="address_item_content_bg">
              <div class="address_item_content_top">
                  <span>{{item.receiverName|consigneeFormat}}</span>
                  <span>{{item.phone | mobileSecretFormat}}</span>
                  <span v-if="item.defaultStatus=='Y'">默认</span>
              </div>
              <!-- <div class="address_item_content_bottom" v-if="!dataType"> -->
              <div class="address_item_content_bottom">
                  {{item.province}}{{item.city}}{{item.region}}{{item.addressDetail}}
              </div>
              <!-- <div class="address_item_content_bottom">
                  {{item.addressInfo}}
              </div> -->
          </div>
          <div class="address_item_righticon" :class="'address_item_righticon'+type" @click.stop="rightClick">

          </div>
        </div>
        

    </div>
</template>

<script>
export default {
    props: {
        type: {
            type: String,
            default: '1'
        },
        item: {},
        dataType: {
            type: Number,
            default: 0
        }
    },
    methods: {
        itemClick() {
            this.$emit('itemClick', this.item)
        },
        rightClick() {
            this.$emit('rightClick', this.item);
        }
    }
}
</script>

<style lang="less" scoped>
.address_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 1.44rem;
}
// .address_item2 {
//   border-bottom: 1px solid #f6f6f6;
// }
.address_item_left {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: .9rem;
}
.address_item_lefticon {
  background: url("~imgs/account/address.png") no-repeat;
  background-size: 100% 100%;
  width: .4rem;
  height: .4rem;
}
.address_item_content{
    flex: 1;
    height: 100%;
    border-bottom: .02rem solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: .38rem;
}
.address_item_content_bg{
  flex: 1;
}
.address_item_content_top {
  display: flex;
  height: 0.5rem /* 25/50 */;
}
.address_item_content_top span:nth-child(1) {
  font-size: 0.28rem /* 14/50 */;
  color: #333333;
  width: 1.2rem;
}
.address_item_content_top span:nth-child(2) {
  font-size: 0.28rem /* 14/50 */;
  color: #333333;
  /* padding-left: .3rem; */
  width: 1.8rem;
  text-align: right;
}
.address_item_content_bottom{
  font-size: .24rem;
  color: #999;
  margin-bottom: .1rem;
}
.address_item_content_top span:nth-child(3) {
  margin-left: .1rem;
  font-size: 0.22rem;
  color: #FF4137;
  border: .02rem solid #FF4137;
  border-radius: .04rem;
  width: .64rem;
  height: .36rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.address_item_righticon {
  background: url("~imgs/common/right_arrow_icon.png") no-repeat;
  background-size: 100% 100%;
  width: 0.14rem /* 7/50 */;
  height: 0.24rem /* 12/50 */;
}
.address_item_righticon2 {
  background: url("~imgs/account/edit.png") no-repeat;
  background-size: 100% 100%;
  width: .32rem;
  height: .32rem;
  margin: 0.4rem 0 0.4rem 0.4rem ;
  box-sizing: border-box;
}
</style>
